<template>
  <div class="school_master">
    <!--    侧边栏 左右-->
    <div class="master_silder_menu">
      <div class="menus">
        <!--        <div class="menu_item_index">-->
        <!--          <nuxt-link to="/admin">-->
        <!--            <div class="title"><i class="el-icon-data-analysis" style="margin-right: 10px"></i>概况</div>-->
        <!--          </nuxt-link>-->
        <!--        </div>-->
        <!--        <div class="interval"></div>-->
        <div v-for="(item, index) in list" :key="index" class="menu_item">
          <div class="title">
            <i :class="item.icon" style="margin-right: 10px"></i>{{ item.name }}
          </div>
          <ul>
            <li
              v-for="(item2, index) in item.menuList"
              :key="index"
              :data-menu-id="item2.menuId"
            >
              <nuxt-link
                :to="item2.url"
                :class="active == item2.menuId ? 'active' : ''"
              >{{ item2.name }}
              </nuxt-link>
              <!--              <a :href="item2.url" :class="active==item2.menuId ? 'active':''">{{ item2.name }}</a>-->
            </li>
          </ul>
          <!--          <div class="interval"></div>-->
        </div>
      </div>
    </div>

    <!--    顶部-->
    <div class="edu_top">
      <div class="sidebar">
        <div class="shared_sidebar_top_wrap">
          <span class="shared_sidebar_top_name">{{ bankName }}</span>
        </div>
      </div>
      <div class="topMenu">
        <div class="topMenuLeft">基本模板</div>
        <!--        <div class="topMenuRight">-->
        <!--          <a class="shared_header_contact" href="#" target="_blank" rel="noopener noreferrer">-->
        <!--            <i class="el-icon-chat-dot-round" style="margin-right: 8px;"></i>-->
        <!--            <span data-pc-shared="">修改密码</span>-->
        <!--          </a>-->
        <!--          <span class="separator">丨</span>-->
        <!--          <a class="shared_setting_menu">-->
        <!--            <div>-->
        <!--              <span>{{ name }}</span>-->
        <!--              <i class="el-icon-arrow-down"></i>-->
        <!--              <div class="log_out" @click="loginOut">退出登录</div>-->

        <!--            </div>-->
        <!--          </a>-->
        <!--        </div>-->

        <div class="topMenuRight">
          <!--          <a class="shared_header_contact" href="#" target="_blank" rel="noopener noreferrer">-->
          <!--            <i class="el-icon-chat-dot-round" style="margin-right: 8px;"></i>-->
          <!--            <span data-pc-shared="">客服</span>-->
          <!--          </a>-->
          <!--          <span class="separator">丨</span>-->

          <el-dropdown>
            <a class="shared_setting_menu">
              <div>
                <!--                <img src="https://wework.qpic.cn/bizmail/UJF4ZxOQnULE8WCiazp2Yesh9ib6211BP3H2M326SCyiaibAlTT6X9IjXg/0">-->
                <span>{{ nickname }}</span>
                <i class="el-icon-arrow-down"></i>
                <!--                <div class="log_out" @click="loginOut">退出登录</div>-->
              </div>
            </a>
            <el-dropdown-menu slot="dropdown">
              <el-dropdown-item @click.native="loginOut"
              >退出登录
              </el-dropdown-item>
              <el-dropdown-item @click.native="updatePassword"
              >修改密码
              </el-dropdown-item>
            </el-dropdown-menu>
          </el-dropdown>
        </div>
      </div>
    </div>
    <!--    中间main部分-->
    <div class="ss-main">
      <nuxt-child/>
    </div>
  </div>
</template>

<script>
//
import menuList from '../util/menuList'

export default {
  name: "Admin",
  data() {
    return {
      list: [],
      bankName: "管理后台基本模板",
      active: "101",
      titleName: "概况",
      visible: false,
      nickname: "暴龙兽",
      name: "",
    }
  },
  mounted() {
    this.init()
  },
  methods: {
    init() {
      // 模拟接口请求侧边栏的菜单栏数据
      this.list = menuList.menuList
    },
    changeTitle(name) {
      this.titleName = name
    },
    loginOut() {
      this.$http.post(`/admin/user/logout.json`).then((res) => {
        this.$router.push("/login")
      })
    },
    updatePassword() {
      this.$router.push("/admin/user/update")
    },
  },
}
</script>

<style scoped lang="less">
@import "./admin.less";
</style>

<style scoped lang="less"></style>
